<template>
  <div class="homeRecommend" v-if="recommend">
    <!-- <RecommendBanner /> -->
    <van-swipe
      class="my-swipe"
      :autoplay="3000"
      indicator-color="white"
      lazy-render
    >
      <van-swipe-item v-for="(item, index) in recommend.banner" :key="index">
        <van-image width="375" height="auto" :src="item.i" lazy-load />
      </van-swipe-item>
    </van-swipe>
    <RecommendCookbook
      v-for="(item, index) in recommend.list"
      :key="index"
      :item="item"
    />
  </div>
</template>

<script setup lang="ts">
import RecommendCookbook from "@/components/RecommendCookbook.vue";
import { useDouguoStore } from "@/stores/douguo";
import { storeToRefs } from "pinia";
const douguo = useDouguoStore();

const { recommend } = storeToRefs(douguo);
const { updataRecommend } = douguo;

updataRecommend();
</script>

<style lang="scss" scoped></style>
